import React, { useEffect } from 'react';
import { Layout } from 'antd';
import IndexContent from './components/IndexContent';
import IndexFooter from './components/IndexFooter';
import IndexHeader from './components/IndexHeader';
import IndexSider from './components/IndexSider';


// 引入封装的dispatch
import { useAppDispatch } from '@/hooks';
// 引入异步的action
import { getInfoAsync } from '@/store/slice/auth';

import "./index.less";



const Index: React.FC = () => {
  // 创建dispatch
  const dispatch =useAppDispatch()
  // 在useEffect钩子函数里(组件挂载完成后)调用异步action
  useEffect(()=>{
    dispatch(getInfoAsync())
  },[])

  return (
    <Layout style={{minHeight: '100vh'}}>
    <IndexSider/>
      <Layout className="site-layout">
        <IndexHeader/>
        <IndexContent/>
        <IndexFooter/>
      </Layout>
    </Layout>
  );
};

export default Index;